//1. 引入 useState 
import React, {useState} from "react";

export default function Func(props) {
    // console.log(props);
    //2. 创建一个状态
    let [count, setCount] = useState(100); //
    //创建一个容器
    let h2 = React.useRef();
    let h1 = React.useRef();// createRef

    //声明一个函数
    let clickHandle = () => {
        //自增状态
        setCount(count + 1);
    };

    let getH2 = () => {
        console.log(h2.current);
        console.log(h1.current);
    }

    //3. 使用和设置状态
    return (
        <div style={{ padding: "50px" }}>
            <h1 ref={h1}>{count}</h1>
            <button onClick={clickHandle}>新增</button>
            <h2 ref={h2}>我们是 {props.name}</h2>
            <button onClick={getH2}>获取 H2 元素</button>
        </div>
    );
}
